<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:t="http://myfaces.apache.org/tomahawk"  
      >
 <head>
 </head>    
  <ui:composition template="/templates/default/template.xhtml">
    	<ui:define name="body"> 
 			<h:panelGrid columns="1" style="margin-left:5px;width:100%">	
 				<!--  tieu de -->
	 			<h:panelGrid columns="3" styleClass="columPanelbaritemTitle">
					<h:graphicImage value="/templates/default/images/left-heading_01.jpg" style="margin-left:-4px;margin-bottom:0px"></h:graphicImage>
			  		<h:outputText value="Báo cáo tổng hợp" styleClass="panelbaritemTitle"></h:outputText>
					<h:graphicImage value="/templates/default/images/left-heading_03.jpg"></h:graphicImage>
		  		</h:panelGrid>
		  			<!-- ket thuc tieu de -->
					<!-- phan noi dung phia duoi -->
		  		<h:panelGrid columns="1" styleClass="panelGridBody">
				<h:form id="frm">
				<rich:panel style="background:#FFFFFF">
				  <h:panelGrid columns="2" style="margin-left:80px">
			       <h:outputText></h:outputText>
				   <h:outputText id="idError" value="#{beanSearchBaoCaoTongHop.error}" style=" color: red;" escape="false">
			       </h:outputText>
		    	    <h:outputText value="Tiêu chí" styleClass="inputText"></h:outputText>
		    	    <!-- 
		    	   <h:selectOneMenu id="tieuchi" value="#{beanSearchBaoCaoTongHop.tieuChi}" styleClass="InputControl">
		    	      <f:selectItems value="#{beanBCTongHop.selectItem}" />				
			        <a4j:support action="#{beanSearchBaoCaoTongHop.setLableInput}" event="onchange"
				          reRender="idOut1,idOut2,idOut3,idOut4" >
				         </a4j:support> 					
		    	   </h:selectOneMenu>
		    	     -->
		    	     <h:selectOneMenu id="tieuchi" value="#{beanSearchBaoCaoTongHop.tieuChi}" styleClass="InputControl"
		    	     onchange="
		    	     var objSelect = document.getElementById('frm:tieuchi');
		    	     var objBieumau = document.getElementById('bieumau');
		    	     var objInput1 = document.getElementById('frm:t1');
		    	     var objInput2 = document.getElementById('frm:t2');
		    	     var objInput3 = document.getElementById('frm:t3');
		    	     var objInput4 = document.getElementById('frm:t4');
		    	     var objLabe1 = document.getElementById('frm:idOut1');
		    	     var objLabe2 = document.getElementById('frm:idOut2');
		    	     var objLabe3 = document.getElementById('frm:idOut3');
		    	     var objLabe4 = document.getElementById('frm:idOut4');
		    	     var objError = document.getElementById('frm:idError');
		    	     indexSelected = objSelect.selectedIndex;
		    	     
		    	        objBieumau.style.display ='none';
		    	        objError.innerHTML = '';
		    	     	objInput1.value = '';
	    	      		objInput2.value ='';
	    	      		objInput3.value ='';
	    	      		objInput4.value ='';
		    	     
		    	     if(indexSelected != null)
		    	     {
		    	     if(indexSelected == '0') 
		    	       {
		    	      		objInput1.style.display ='none';
		    	      		objInput2.style.display ='none';
		    	      		objInput3.style.display ='none';
		    	      		objInput4.style.display ='none';
		    	      		objInput1.value ='';
		    	      		objInput2.value ='';
		    	      		objInput3.value ='';
		    	      		objInput4.value ='';
		    	      		objLabe1.innerHTML = '';
		    	      		objLabe2.innerHTML = '';
		    	      		objLabe3.innerHTML = '';
		    	      		objLabe4.innerHTML = '';
		    	       }
		    	      else if(indexSelected == '1') 
		    	       {
		    	      		objInput1.style.display ='block';
		    	      		objInput2.style.display ='block';
		    	      		objInput3.style.display ='none';
		    	      		objInput4.style.display ='none';
		    	      		objLabe1.innerHTML = 'Thời gian(Tháng/Năm)(*)';
		    	      		objLabe2.innerHTML = 'Địa điểm(*)';
		    	      		objLabe3.innerHTML = '';
		    	      		objLabe4.innerHTML = '';
		    	       }
		    	       else if(indexSelected == '2') 
		    	       {
		    	      		objInput1.style.display ='block';
		    	      		objInput2.style.display ='block';
		    	      		objInput3.style.display ='none';
		    	      		objInput4.style.display ='none';
		    	      		objLabe1.innerHTML = 'Giới tính(*)';
		    	      		objLabe2.innerHTML = 'Quốc tịch(*)';
		    	      		objLabe3.innerHTML = '';
		    	      		objLabe4.innerHTML = '';
		    	       }
		    	       else if(indexSelected == '3') 
		    	       {
		    	      		objInput1.style.display ='block';
		    	      		objInput2.style.display ='block';
		    	      		objInput3.style.display ='none';
		    	      		objInput4.style.display ='none';
		    	      		objLabe2.innerHTML = 'Giới tính(*)';
		    	      		objLabe1.innerHTML = 'Quốc tịch(*)';
		    	      		objLabe3.innerHTML = '';
		    	      		objLabe4.innerHTML = '';
		    	       }
		    	       else if(indexSelected == '4') 
		    	       {
		    	      		objInput1.style.display ='block';
		    	      		objInput2.style.display ='block';
		    	      		objInput3.style.display ='block';
		    	      		objLabe2.innerHTML = 'Giới tính(*)';
		    	      		objLabe1.innerHTML = 'Quốc tịch(*)';
		    	      		objLabe3.innerHTML = 'Thời gian(Tháng/Năm)(*)';
		    	       }
		    	       else if(indexSelected == '5') 
		    	       {
		    	      		objInput1.style.display ='block';
		    	      		objInput2.style.display ='block';
		    	      		objInput3.style.display ='block';
		    	      		objLabe2.innerHTML = 'Giới tính(*)';
		    	      		objLabe1.innerHTML = 'Quốc tịch(*)';
		    	      		objLabe3.innerHTML = 'Địa điểm(*)';
		    	       }
		    	       else if(indexSelected == '6') 
		    	       {
		    	      		objInput1.style.display ='block';
		    	      		objInput2.style.display ='block';
		    	      		objInput3.style.display ='block';
		    	      		objInput4.style.display ='block';
		    	      		objLabe2.innerHTML = 'Giới tính(*)';
		    	      		objLabe1.innerHTML = 'Quốc tịch(*)';
		    	      		objLabe3.innerHTML = 'Thời gian(Tháng/Năm)(*)';
		    	      		objLabe4.innerHTML = 'Địa điểm(*)';
		    	       }
		    	      
		    	     }
		    	     "
		    	     >
		    	      
		    	      <f:selectItems value="#{beanBCTongHop.selectItem}" />									
		    	     </h:selectOneMenu>
		    	   
		    	    <h:outputText id="idOut1" styleClass="inputText" style="margin-left:2px;"></h:outputText>		    		
		    		<h:inputText style="display:none" id="t1"  value="#{beanSearchBaoCaoTongHop.thongtin1}" styleClass="InputControl">
		    		</h:inputText>
				    <h:outputText id="idOut2" styleClass="inputText" style="margin-left:2px;"></h:outputText>		    		
		    		<h:inputText style="display:none" id="t2"  value="#{beanSearchBaoCaoTongHop.thongtin2}" styleClass="InputControl">
		    		</h:inputText>
		    		<h:outputText id="idOut3"  styleClass="inputText" style="margin-left:2px;"></h:outputText>		    		
		    		<h:inputText style="display:none" id="t3"  value="#{beanSearchBaoCaoTongHop.thongtin3}" styleClass="InputControl">
		    		</h:inputText>
				    <h:outputText id="idOut4"  styleClass="inputText" style="margin-left:2px;"></h:outputText>		    		
		    		<h:inputText style="display:none" id="t4"  value="#{beanSearchBaoCaoTongHop.thongtin4}" styleClass="InputControl">
		    		</h:inputText>
			  		<!-- action -->	
			  	  </h:panelGrid>
			  	   <h:panelGrid columns="3" style="margin-left:200px;margin-top:10px">
			  	   <a4j:commandButton  value="Xem" styleClass="Button"
			    	   reRender="idError" action="#{beanSearchBaoCaoTongHop.view}" ></a4j:commandButton>
			        <a4j:commandButton   value="Reset" styleClass="Button" action="#{beanBCTongHop.reset}"></a4j:commandButton>
			      </h:panelGrid>
		  		</rich:panel>
		  		  <!-- ket thuc action -->
				</h:form>
			   </h:panelGrid>	
			   <h:panelGrid columns="1" id="bieumau">
			   <ui:include src="#{beanSearchBaoCaoTongHop.bieumaukq}" /> 
			   </h:panelGrid>
			</h:panelGrid>  
</ui:define>
</ui:composition>			
      
 </html>     